<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ include file="/WEB-INF/jsp/business/include/doctype.jsp" %>
<link rel="stylesheet" type="text/css" href="${requestScope.contextPath}/js/jquery-ui-1.8.14.custom/css/ui-lightness/jquery-ui-1.8.14.custom.css" />
<script language="javascript" type="text/javascript">
function appBack() {
	document.location.href='${requestScope.contextPath}/business/mAccessMan/mAccessManApplyList.do';
}
<!--
$(document).ready(function() {
	$('#sel_business_code').change(function() {
		$('#sel_access_auth_code').html('<option value=\"\">방문장소 선택</option>');
		if($(this).val() != '') {
			$.ajax({
				url: '${requestScope.contextPath}/business/mAccessMan/mAccessManApplyBusiness.do',
				type:'POST',
				data: {
					'business_code': $(this).val()
				},
				dataType:'json',
				success: function(json){
				  if( json ){
						for( i = 0 ; i < json.list.length; i++ ){
							$('#sel_access_auth_code').append('<option value=\"' + json.list[i].CODE + '\">' + json.list[i].NAME + '</option>');
						}
					}
				},
				error: function(){
					alert('error');
				}
			});
		}
	});
});

$(function() {
	var dates = $('#txt_reservation_date').datepicker({
		showOn: "button",
		buttonImage: "${requestScope.contextPath}/images/reservation/cal1.gif",
		buttonImageOnly: true,
		numberOfMonths: 1,
		dateFormat: 'yy-mm-dd',
		showMonthAfterYear:true,
		monthNamesShort: ['1월','2월','3월','4월','5월','6월','7월','8월','9월','10월','11월','12월'],
		dayNamesMin: ['일', '월', '화', '수', '목', '금', '토'],
		showButtonPanel: true,
		onSelect: function(selectedDate) {
			var option = this.id == "startdate" ? "minDate" : "maxDate";
			var instance = $(this).data("datepicker");
			var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
			dates.not(this).datepicker("option", option, date);
		}
	});
});

function goSubmit(){
	
	if ($.trim($('#txt_visitor_name').val()) == "") {
        alert('방문객 이름을 입력하세요.');
        $('#txt_visitor_name').focus();
        return;
    }

    if ($.trim($('#txt_visitor_comp_name').val()) == "") {
        alert('방문객 회사를 입력하세요.');
        $('#txt_visitor_comp_name').focus();
        return;
    }

    if ($.trim($('#txt_visitor_tel_no').val()) == "") {
        alert('방문객 연락처를 입력하세요.');
        $('#txt_visitor_tel_no').focus();
        return;
    }

    if ($.trim($('#sel_access_auth_code').val()) == "") {
        alert('방문장소를 선택하세요.');
        $('#sel_access_auth_code').focus();
        return;
    }

    if ($('#txt_reservation_date').val() == "") {
        alert('예약일시를 선택하세요.');
        $('#txt_reservation_date').focus();
        return;
    }

    if ($.trim($('#txt_visitor_reason').val()) == "") {
        alert('방문목적을 입력 하하세요.');
        $('#txt_visitor_reason').focus();
        return;
    }
    

    //동행인수를 기준으로 동행인 정보 처리
    var visitorParam = "";
    if ($.trim($('#visitor_per_cnt').val()) != "") {
    	
    	var cnt = $('#visitor_per_cnt').val();
    	for(var i=1;i<=cnt;i++)
    	{
    		visitorParam += eval("document.form.visitor_detail_seq"+i).value+"|" + eval("document.form.visitor_name"+i).value +"|" + eval("document.form.visitor_tel_no"+i).value +"♀";
    	}
    	document.form.CompanionDetail.value=visitorParam;    	
    }
	if (confirm('수정하시겠습니까?')) {
		document.form.submit();
	}
	return;
}
function ApplyCancel(){
	var bConfirm = confirm("예약을 취소 하시겠습니까?");
	if (bConfirm == false) return;
	location.href='${requestScope.contextPath}/business/mAccessMan/mAccessManApplyCancel.do?ApplySeq=${viewMap.APPLY_SEQ}';
}
function setVisible(popId) { 
	var t=document.getElementById(popId);
	var check = 1;
	if ($.trim($('#txt_visitor_name').val()) == "" || $.trim($('#txt_visitor_name').val()).length < 2) {
		alert('방문객 이름을 2자 이상 입력하세요.');
		$('#txt_visitor_name').focus();
		check = 0;
	}

	if(check == 1) {
		$('#apply').html('');
		$.ajax({
			url: '${requestScope.contextPath}/business/mAccessMan/mAccessManApplySearchPop.do',
			type:'POST',
			data: {
				'txt_visitor_name': $.trim($('#txt_visitor_name').val())
			},
			dataType:'json',
			success: function(json){
			  if( json && json.list1.length > 0){
					for( i = 0 ; i < json.list1.length; i++ ){
						$('#apply').append('<li><span style="display:block; width:220px;">' + json.list1[i].name + ', ' + json.list1[i].dept + '<span class="block">' + json.list1[i].phone + '&nbsp;</span><span class="ripply"><a href="javascript:selectPop(\'searchPop\',\''+json.list1[i].name+'\',\''+json.list1[i].dept+'\',\''+json.list1[i].phone+'\');"><img src="${requestScope.contextPath}/images/btn/btn_select.gif" alt="선택" /></a></span></li>');
					}

					for( i = 0 ; i < json.list2.length; i++ ){
						$('#apply').append('<li><span style="display:block; width:220px;">' + json.list2[i].name + ', ' + json.list2[i].dept + '<span class="block">' + json.list2[i].phone + '&nbsp;</span><span class="ripply"><a href="javascript:selectPop(\'searchPop\',\''+json.list2[i].name+'\',\''+json.list2[i].dept+'\',\''+json.list2[i].phone+'\');"><img src="${requestScope.contextPath}/images/btn/btn_select.gif" alt="선택" /></a></span></li>');
					}

					if (t.style.display != "block") {
						t.style.display ="block";
						document.getElementById('content').style.display="none";
					}else{
						t.style.display ="none";
						document.getElementById('content').style.display="block";
					}
				}else{
					alert('검색결과가 없습니다.');
				}
			},
			error: function(){
				alert('error');
			}
		});
    }
}


function selectPop(popId, name, dept, phoneNum) {
	if (confirm('방문자 ' + name +'님을 선택하시겠습니까?')) {
		var t=document.getElementById(popId);
		if (t.style.display != "block") {
			t.style.display ="block";
			document.getElementById('content').style.display="none";
		}else{
			t.style.display ="none";
			document.getElementById('content').style.display="block";
		}
		$('#txt_visitor_name').val(name);
		$('#txt_visitor_comp_name').val(dept);
		$('#txt_visitor_tel_no').val(phoneNum);
		//document.documentElement.scrollTop = 0;
		//document.body.scrollTop = 0;
	}
}

//-->	
</script>
</head>

<body>
	<div id="wrap">
		<div class="header">
			<h1>출입관리</h1>
		</div><!-- // header -->
		<div class="content" id="content">
			
			<ul class="tab">
				<li><a href="${requestScope.contextPath}/business/mAccessMan/mAccessManApplyWrite.do"><img src="${requestScope.contextPath}/images/access/tab1_over.gif" alt="방문객 등록" /></a></li>
				<li><a href="${requestScope.contextPath}/business/mAccessMan/mAccessManApplyList.do"><img src="${requestScope.contextPath}/images/access/tab2.gif" alt="나의 신청현황" /></a></li>
			</ul>
			<div class="access">
				<div class="table5">
					<form name="form" action="${requestScope.contextPath}/business/mAccessMan/mAccessManApplyView.do" method="post" onsubmit="return false;">
					<input type="hidden" name="Mode" value="Save">		
					<input type="hidden" name="Apply_Seq" value="${viewMap.APPLY_SEQ }">				
					<input type="hidden" name="CompanionDetail" value="">
					<input type="hidden" name="visitor_per_cnt" id="visitor_per_cnt" value="${viewMap.VISITOR_PER_CNT}">
					<table summary="" cellspacing="0" style="width:100%">
						<caption>출입관리</caption>
						<colgroup>
							<col style="width:20%" />
							<col style="width:80%" />
						</colgroup>
						<tbody>
							<tr>
								<th scope="row">이름</th>
								<td>
									<input type="text" name="txt_visitor_name" value="${viewMap.VISITOR_NAME }" id="txt_visitor_name" />&nbsp;<a href="javascript:setVisible('searchPop');"><img src="${requestScope.contextPath}/images/btn/btn_search2.gif" alt="검색" /></a>
								</td>
							</tr>
							<tr>
								<th scope="row">회사명</th>
								<td><input type="text" name="txt_visitor_comp_name"  value="${viewMap.VISITOR_COMP_NAME }" id="txt_visitor_comp_name" /></td>
							</tr>
							<tr>
								<th scope="row">연락처</th>
								<td><input type="text" name="txt_visitor_tel_no" value="${viewMap.VISITOR_TEL_NO }" id="txt_visitor_tel_no" /></td>
							</tr>
							<tr>
								<th scope="row">방문장소</th>
								<td>
									<p><select title="사업장 선택" name="sel_business_code" id="sel_business_code" style="width:150px;">
									<option value="">사업장 선택</option>
									<c:forEach items="${mapList3}" var="mapInfo" varStatus="status">
									<option value="${mapInfo.BUSINESS_CODE}" <c:if test="${mapInfo.BUSINESS_CODE eq viewMap.BUSINESS_CODE}">selected</c:if>>${mapInfo.BUSINESS_NAME}</option>
									</c:forEach>
									</select></p>
									<p><select title="방문장소 선택" name="sel_access_auth_code" id="sel_access_auth_code" style="width:150px;">
									<option value="">방문장소 선택</option>
									<c:forEach items="${mapList4}" var="mapInfo" varStatus="status">
									<option value="${mapInfo.CODE}" <c:if test="${mapInfo.CODE eq viewMap.ACCESS_AUTH_CODE}">selected</c:if>>${mapInfo.NAME}</option>
									</c:forEach>
									</select></p>
								</td>
							</tr>
							<tr>
								<th scope="row">예약일시</th>
								<td>
									   <input type="text" name="txt_reservation_date" value="${viewMap.RESERVATION_DATE }" id="txt_reservation_date" class="" readonly="readonly" /><br />
									   <p><select name="txt_reservation_start_hour" style="width:30%;">
											<c:forEach var = "i" begin = "1" end = "24" step = "1" varStatus = "status">										   
											<option value="<c:if test="${i <= 9}">0</c:if>${i}" <c:if test="${i eq viewMap.RESERVATION_START_HH}">selected</c:if>><c:if test="${i <= 9}">0</c:if>${i}</option>										
											</c:forEach>
										</select>시
										<select name="txt_reservation_start_minute" style="width:30%;">
											<c:forEach var = "i" begin = "00" end = "50" step = "10" varStatus = "status">
											<option value="<c:if test="${i < 10}">0</c:if>${i}" <c:if test="${i eq viewMap.RESERVATION_START_MM}">selected</c:if>><c:if test="${i < 10}">0</c:if>${i}</option>
											</c:forEach>
										</select> 분 부터</p>
										<p><select name="txt_reservation_end_hour" style="width:30%;">										
											<c:forEach var = "i" begin = "1" end = "24" step = "1" varStatus = "status">										   
											<option value="<c:if test="${i <= 9}">0</c:if>${i}" <c:if test="${i eq viewMap.RESERVATION_END_HH}">selected</c:if>><c:if test="${i <= 9}">0</c:if>${i}</option>										
											</c:forEach>
										</select>시
										<select name="txt_reservation_end_minute" style="width:30%;">
											<c:forEach var = "i" begin = "00" end = "50" step = "10" varStatus = "status">
											<option value="<c:if test="${i < 10}">0</c:if>${i}" <c:if test="${i eq viewMap.RESERVATION_END_MM}">selected</c:if>><c:if test="${i < 10}">0</c:if>${i}</option>
											</c:forEach>
										</select> 분 까지</p>
								</td>
							</tr>
							<tr>
								<th scope="row">방문목적</th>
								<td>
									<textarea cols="25" rows="1" name="txt_visitor_reason" id="txt_visitor_reason" class="comment">${viewMap.VISITOR_REASON }</textarea>
								</td>
							</tr>
							<tr>
								<th scope="row">동행인수</th>
								<td>
									
									<select disabled=true>
									<option value="">0</option>
									<c:forEach var="i" begin="1" end="10" step="1" varStatus="status">
									<option value="${i}" <c:if test="${i eq viewMap.VISITOR_PER_CNT}">selected</c:if>>${i}</option>
									</c:forEach>
									</select><br />
									<div id="visitor_txt" style="display:none;">동행인 이름 / 연락처</div>
									
									<c:forEach items="${mapList2}" var="mapInfo2" varStatus="status">
									<p><input type="hidden" name="visitor_detail_seq${status.count }" value="${mapInfo2.VISITOR_DETAIL_SEQ }" class="intxt4" />
									<input type="text" name="visitor_name${status.count }" value="${mapInfo2.VISITOR_NAME }"  class="intxt4" />&nbsp;<input type="text" name="visitor_tel_no${status.count }" value="${mapInfo2.VISITOR_TEL_NO }" class="intxt5" /></p>
									</c:forEach>
									<script type="text/javascript">
									</script>
								</td>
							</tr>
						</tbody>
					</table>
				</div>
				<div class="btn_area1">
					<p class="left_area1"><a href="javascript:ApplyCancel()"><img src="${requestScope.contextPath}/images/btn/btn_reset3.gif" alt="예약취소" /></a></p>
					<p class="left_area1"><img src="${requestScope.contextPath}/images/btn/btn_modify.gif" alt="수정" style="cursor: pointer;" onclick="goSubmit();" /></p>
					<div class="right_area">
						<p><a href="${requestScope.contextPath}/business/mAccessMan/mAccessManApplyList.do"><img src="${requestScope.contextPath}/images/btn/btn_list.gif" alt="목록" /></a></p>
					</div>
				</div>
				</form>
			</div>
		</div><!-- // content -->
		<div id="searchPop" style="position:absolute; z-index:1; top:0px; width:100%; height:100%; display:none; background-color:#ffffff;">
			<div class="header">
				<h1>방문자 검색</h1>
				<p class="list"><a href="javascript:setVisible('searchPop');"><img src="${requestScope.contextPath}/images/btn/btn_close2.gif" alt="닫기" /></a></p>
			</div><!-- // header -->
			<div class="content">
				<div class="access">
					<ul id="apply">
					</ul>
				</div>
			</div><!-- // content -->
		</div>
	</div><!-- // wrap -->
</body>
</html>
